<template>
  <!-- 顶部内容, 书写在这里, 通过传送门(teleporter) 放在顶部内 -->
  <teleport to=".header">
    <SdyHeader center="search" />
  </teleport>

  <van-list
    v-model:loading="loading"
    :finished="false"
    finished-text="没有更多了">
    <div @click="$myRouter.push({ path: '/detail', query: { proid: item.proid } })" v-for="item in goodsList">
      <img src="../../001.png" alt="">
    </div>
  </van-list>
</template>

<script name="sdyList" lang="ts" setup>
import SdyHeader from '../../components/header.vue'
import { useRoute, useRouter } from 'vue-router'
import { ref, onMounted } from 'vue'
import { getSearchList } from '../../model/goods'

// 拿到路由传递来的信息
const $myRoute = useRoute()
const $myRouter = useRouter()

// 准备一个变量, 表示商品列表
const goodsList = ref([])

const loading = ref<boolean>(true)

// 根据关键字发送请求
const getGoodsList = async () => {
  const keyword = $myRoute.query.keyword as string
  const res = await getSearchList(keyword)
  if ((res as any).code !== '200') return
  goodsList.value = res.data
  console.log(res)
}

onMounted(() => {
  getGoodsList()
})

</script>

<style scoped lang="scss"></style>
